<template>
    <div>
        <el-form ref="ruleForm" :model="obj" :rules="rules">
            <el-row :gutter="1">
                <el-col :span="24">
                    <el-form-item label="输入密语 :" prop="secretKey" :label-width="formLabelWidth3">
                        <el-input size="small" v-model="obj.secretKey"></el-input>
                        <span style="color: red;">简单密语和在线生成私钥都十分危险，可导致该地址资产丢失！</span>
                    </el-form-item>
                </el-col>
            </el-row>
            <div style="text-align: left;margin-bottom: 10px">
                <el-form-item label="" :label-width="formLabelWidth3">
                    <el-button type="primary" size="small" @click="AdressChange">生成</el-button>

                </el-form-item>
            </div>
            <el-row :gutter="1">
                <el-col :span="24">
                    <el-form-item label="地址 :" :label-width="formLabelWidth3">
                        <span style="width: 75%;display: inline-block">{{newAddress}}</span>
                        <el-button class="block_btn" type="primary" size="small" @click="initQrcode(newAddress)">二维码</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="1">
                <el-col :span="24">
                    <el-form-item label="私钥 :" :label-width="formLabelWidth3">
                        <span style="width: 75%;display: inline-block">{{privateKey}}</span>
                        <el-button class="block_btn" type="primary" size="small" @click="initQrcode(privateKey)">二维码</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
            <el-row :gutter="1">
                <el-col :span="24">
                    <el-form-item label="公钥 :" :label-width="formLabelWidth3">
                        <span style="width: 75%;display: inline-block">{{publicKey}}</span>
                        <el-button class="block_btn" type="primary" size="small" @click="initQrcode(publicKey)">二维码</el-button>
                    </el-form-item>
                </el-col>
            </el-row>
        </el-form>
        <el-dialog
            title=""
            :visible.sync="dialogVisible"
            width="240px"
            :before-close="handleClose">
            <EWMD ref="EWMdialog" :proParm="qrcode"></EWMD>
        </el-dialog>
    </div>
</template>

<script>
import allApi from '../../static/fchjstool/all-api';
import EWMD from './ewm';
export default {
    name: 'generateAddress',
    components: { EWMD },
    data() {
        return {
            formLabelWidth1: '60px',
            formLabelWidth2: '80px',
            formLabelWidth3: '88px',
            obj: {
                secretKey: ''
            },
            rules: {
                secretKey: [
                    { required: true, message: '请输入密语', trigger: ['blur', 'change'] }
                ]
            },
            newAddress: '',
            privateKey: '',
            publicKey: '',
            dialogVisible: false,
            qrcode: ''
        }
    },
    props: ['proParm'],
    methods: {
        initQrcode(result) {
            this.qrcode = result;
            this.dialogVisible = true;
            if (this.$refs.EWMdialog) {
                this.$refs.EWMdialog.init(result);
            }
        },
        AdressChange() {
            this.$refs['ruleForm'].validate(async (valid) => {
                if (valid) {
                    try {
                        let arr = generateAdress(this.proParm, this.obj.secretKey);
                        this.newAddress = arr[1];
                        this.privateKey = arr[0];
                        this.publicKey = getPublickKeyFromWIF(this.proParm, this.privateKey);
                    }
                    catch (e) {
                        this.newAddress = '';
                        this.privateKey = '';
                        this.publicKey = '';
                        this.$message.error(e);
                    }
                } else {
                    return false;
                }
            });
        },
        handleClose(done) {
            done();
        }
    }
}
</script>

<style scoped lang="less">

    /deep/ .el-form-item__label{
        padding: 0 5px 0 0;
    }
    .line {
        width: 100%;
        height: 5px;
        margin: 5px 0;
        background-color: #e4e7ed;
        z-index: 1;
    }

    .erweima {
        width: 30px;
        height: 30px;
        background: url("../../static/images/erweima.png");
        background-size: cover;
        display: inline-block;
        margin-top: 90px;
        margin-left: 20px;
        vertical-align: -10px;
    }
</style>
